@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}

/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		4;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	12;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

.fluid {
	clear: both;
	margin-left: 0;
	width: 100%;
	float: left;
	display: block;
}

.fluidList {
    list-style:none;
    list-style-image:none;
    margin:0;
    padding:0;        
}

/* Mobile Layout: 480px and below. */
  
.gridContainer {
	margin:0 auto;
	width: 100%;
	clear: none;
	float: none;
	overflow:hidden;
}
.logo{width:640px; height:100px; position:relative; margin:0 auto;}
#div1 {
}
.zeroMargin_mobile {
    margin-left: 0;
}
.hide_mobile {
    display: none;
}
.borderBottom{border-bottom:1px dashed #8d8d8d;}

.marginT20 {margin-top: 20px;}
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 320px) {

.gridContainer {
	width: 100%;
	clear: none;
	float: none;
	margin:0 auto;
	overflow:hidden;
}
.gridContainer01{padding:0 10px;}
.logo{width:100%; height:50px; position:relative; margin:0 auto;}

.flickerplate {
	width:320px;
	height:130px;
	background-color:#e6e6e6;
	overflow:hidden;
}
.flickerplate .dot-navigation {
	position:absolute;
	top:150px;
	width:320px;
	text-align:center;
	z-index:100
}

.flickerplate .arrow-navigation {
	position:absolute;
	height:130px;
	width:10%;
	top:50px;
	z-index:100;
	overflow:hidden
}

.pic{width:300px;}

.headingStyle{
	font-size:14px;
	}
.search{padding:0;}
.searchInput{background: url(../images/IconSearch.png) no-repeat 14px 6px #ccffff; border:none; height:30px; line-height:30px; color:#646464; padding-left:40px; width:260px;}
.TextDescribe{background:#33cccc; color:#fff; padding:10px 10px; font-size:14px; width:280px;}



.CustomDivision{width:100px;}
.CustomDivision ul li{text-align:center;}
.CustomDivision ul li a{display:block; width:90px; height:90px; background:url(../images/BgCustom02.png) no-repeat 0 0; padding:5px;}
.CustomDivision ul li a:hover{background:url(../images/BgCustom02.png) no-repeat 0 -100px;}

#CustomDivisionDescribe01 .triangle{background:url(../images/triangle01.png) no-repeat 56px 0; width:100%; height:10px;}
#CustomDivisionDescribe02 .triangle{background:url(../images/triangle01) no-repeat 200px 0; width:100%; height:10px;}
#CustomDivisionDescribe03 .triangle{background:url(../images/triangle01.png) no-repeat 400px 0; width:100%; height:10px;}
.CustomDivisionDescribe{display:none;}
.CustomDivisionDescribe .content{background:#ccffff; line-height:20px; width:280px; padding:10px; font-size:12px;}



.bottomNav{height:40px; background:#33cccc; text-align:center}
.Nav{width:320px; margin:0 auto; overflow:hidden;}
.bottomNav a{float:left;}
.bottomNav .Nav01{display:block; background:url(../images/Nav02.png) no-repeat 0 0 ; width:80px; height:40px;}
.bottomNav .Nav01:hover{background:url(../images/Nav02.png) no-repeat 0 -40px;}
.bottomNav .Nav01current{display:block;background:url(../images/Nav02.png) no-repeat 0 -40px; width:80px; height:40px;}
.bottomNav .Nav02{display:block; background:url(../images/Nav02.png) no-repeat -80px 0; width:80px; height:40px;}
.bottomNav .Nav02:hover{background:url(../images/Nav02.png) no-repeat -80px -40px;}
.bottomNav .Nav02current{display:block;background:url(../images/Nav02.png) no-repeat -80px -40px; width:80px; height:40px;}
.bottomNav .Nav03{display:block; background:url(../images/Nav02.png) no-repeat -160px 0; width:80px; height:40px;}
.bottomNav .Nav03:hover{background:url(../images/Nav02.png) no-repeat -160px -40px;}
.bottomNav .Nav03current{display:block;background:url(../images/Nav02.png) no-repeat -160px -40px; width:80px; height:60px;}
.bottomNav .Nav04{display:block; background:url(../images/Nav02.png) no-repeat -240px 0; width:80px; height:30px;}
.bottomNav .Nav04:hover{background:url(../images/Nav02.png) no-repeat -240px -40px;}
.bottomNav .Nav04current{display:block;background:url(../images/Nav02.png) no-repeat -240px -40px; width:80px; height:4s0px;}
}

@media only screen and (min-width: 480px) {

.gridContainer {
	width: 100%;
	clear: none;
	float: none;
	margin:0 auto;
	overflow:hidden;
}
.gridContainer01{padding:0 10px;}
.logo{width:100%; height:75px; position:relative; margin:0 auto;}

.flickerplate {
	width:480px;
	height:200px;
	background-color:#e6e6e6;
	overflow:hidden;
}
.flickerplate .dot-navigation {
	position:absolute;
	top:230px;
	width:480px;
	text-align:center;
	z-index:100
}

.flickerplate .arrow-navigation {
	position:absolute;
	height:200px;
	width:10%;
	top:75px;
	z-index:100;
	overflow:hidden
}

.pic{width:460px;}

.headingStyle{
	font-size:14px;
	}
.search{padding:0;}
.searchInput{background: url(../images/IconSearch.png) no-repeat 24px 15px #ccffff; border:none; height:50px; line-height:50px; color:#646464; padding-left:50px; width:410px;}
.TextDescribe{background:#33cccc; color:#fff; padding:10px 5px; font-size:14px; width:450px;}



.CustomDivision{width:150px; margin:0 1px;}
.CustomDivision ul li{text-align:center;}
.CustomDivision ul li a{display:block; width:140px; height:140px; background:url(../images/BgCustom01.png) no-repeat 0 0; padding:5px;}
.CustomDivision ul li a:hover{background:url(../images/BgCustom01.png) no-repeat 0 -150px;}

#CustomDivisionDescribe01 .triangle{background:url(../images/triangle01.png) no-repeat 56px 0; width:100%; height:10px;}
#CustomDivisionDescribe02 .triangle{background:url(../images/triangle01.png) no-repeat 200px 0; width:100%; height:10px;}
#CustomDivisionDescribe03 .triangle{background:url(../images/triangle01.png) no-repeat 400px 0; width:100%; height:10px;}
.CustomDivisionDescribe{display:none;}
.CustomDivisionDescribe .content{background:#ccffff; line-height:24px; width:440px; padding:10px;}



.bottomNav{height:60px; background:#33cccc; text-align:center}
.Nav{width:480px; margin:0 auto; overflow:hidden;}
.bottomNav a{float:left;}
.bottomNav .Nav01{display:block; background:url(../images/Nav01.png) no-repeat 0 0 ; width:120px; height:60px;}
.bottomNav .Nav01:hover{background:url(../images/Nav01.png) no-repeat 0 -60px;}
.bottomNav .Nav01current{display:block;background:url(../images/Nav01.png) no-repeat 0 -60px; width:120px; height:60px;}
.bottomNav .Nav02{display:block; background:url(../images/Nav01.png) no-repeat -120px 0; width:120px; height:60px;}
.bottomNav .Nav02:hover{background:url(../images/Nav01.png) no-repeat -120px -60px;}
.bottomNav .Nav02current{display:block;background:url(../images/Nav01.png) no-repeat -120px -60px; width:120px; height:60px;}
.bottomNav .Nav03{display:block; background:url(../images/Nav01.png) no-repeat -240px 0; width:120px; height:60px;}
.bottomNav .Nav03:hover{background:url(../images/Nav01.png) no-repeat -240px -60px;}
.bottomNav .Nav03current{display:block;background:url(../images/Nav01.png) no-repeat -240px -60px; width:120px; height:60px;}
.bottomNav .Nav04{display:block; background:url(../images/Nav01.png) no-repeat -360px 0; width:120px; height:60px;}
.bottomNav .Nav04:hover{background:url(../images/Nav01.png) no-repeat -360px -60px;}
.bottomNav .Nav04current{display:block;background:url(../images/Nav01.png) no-repeat -360px -60px; width:120px; height:60px;}
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 640px) {

.gridContainer {
	width: 640px;
	max-width: 1232px;
	clear: none;
	float: none;
	margin:0 auto;
	overflow:hidden;
}
.gridContainer01{padding:0 20px;}
.logo{width:100%; height:100px; position:relative; margin:0 auto;}
.flickerplate {
	width:640px;
	height:260px;
	background-color:#e6e6e6;
	overflow:hidden;
}

.flickerplate .dot-navigation {
	position:absolute;
	top:310px;
	width:640px;
	text-align:center;
	z-index:100
}
.flickerplate .arrow-navigation {
	position:absolute;
	height:260px;
	width:10%;
	top:100px;
	z-index:100;
	overflow:hidden
}


.pic{width:600px;}
.headingStyle{
	font-size:18px;
	}
.search{padding:0;}
.searchInput{background: url(../images/IconSearch.png) no-repeat 24px 15px #ccffff; border:none; height:50px; line-height:50px; color:#646464; padding-left:50px; width:550px;}
.TextDescribe{background:#33cccc; color:#fff; padding:20px 15px; font-size:16px; width:570px;}


.CustomDivision{width:200px; margin:0 1px;}
.CustomDivision ul li{text-align:center;}
.CustomDivision ul li a{display:block; width:180px; height:180px; background:url(../images/BgCustom.png) no-repeat 0 0; padding:10px;}
.CustomDivision ul li a:hover{background:url(../images/BgCustom.png) no-repeat 0 -200px;}

#CustomDivisionDescribe01 .triangle{background:url(../images/triangle.png) no-repeat 84px 0; width:100%; height:17px;}
#CustomDivisionDescribe02 .triangle{background:url(../images/triangle.png) no-repeat 284px 0; width:100%; height:17px;}
#CustomDivisionDescribe03 .triangle{background:url(../images/triangle.png) no-repeat 484px 0; width:100%; height:17px;}
.CustomDivisionDescribe{display:none;}
.CustomDivisionDescribe .content{background:#ccffff; line-height:24px; width:560px; padding:20px;}


.bottomNav{height:80px; background:#33cccc; text-align:center}
.Nav{width:640px; margin:0 auto; overflow:hidden;}
.bottomNav a{float:left;}
.bottomNav .Nav01{display:block; background:url(../images/Nav.png) no-repeat 0 0; width:160px; height:80px;}
.bottomNav .Nav01:hover{background:url(../images/Nav.png) no-repeat 0 -80px;}
.bottomNav .Nav01current{display:block;background:url(../images/Nav.png) no-repeat 0 -80px; width:160px; height:80px;}
.bottomNav .Nav02{display:block; background:url(../images/Nav.png) no-repeat -160px 0; width:160px; height:80px;}
.bottomNav .Nav02:hover{background:url(../images/Nav.png) no-repeat -160px -80px;}
.bottomNav .Nav02current{display:block;background:url(../images/Nav.png) no-repeat -160px -80px; width:160px; height:80px;}
.bottomNav .Nav03{display:block; background:url(../images/Nav.png) no-repeat -320px 0; width:160px; height:80px;}
.bottomNav .Nav03:hover{background:url(../images/Nav.png) no-repeat -320px -80px;}
.bottomNav .Nav03current{display:block;background:url(../images/Nav.png) no-repeat -320px -80px; width:160px; height:80px;}
.bottomNav .Nav04{display:block; background:url(../images/Nav.png) no-repeat -480px 0; width:160px; height:80px;}
.bottomNav .Nav04:hover{background:url(../images/Nav.png) no-repeat -480px -80px;}
.bottomNav .Nav04current{display:block;background:url(../images/Nav.png) no-repeat -480px -80px; width:160px; height:80px;}
}